<template>
  <transition>
    <div class="app-bank-information">
      <section class="app-main">
        <div class="bank-tips">请输入您的提现信息</div>
        <mt-field label="持卡人" placeholder="请输入持卡人" v-model="cardName"></mt-field>
        <mt-field label="银行卡号" placeholder="请输入银行卡号" v-model="cardNumber"></mt-field>
        <mt-field label="开户银行" placeholder="请输入开户银行，具体到支行" v-model="cardBank"></mt-field>
        <div class="money-content">
          <div class="money-input">
            <input class="item-input" type="number" placeholder="请输入提现金额" id="num" v-model="moneyCount"/>
            <div class="money-tips">可提现金额为<span class="money-num js-money-num" v-text="moneyNum"></span>(元)</div>
          </div>
          <div class="action-tips">申请提现后1~2个工作日内直接打入申请银行卡。</div>
        </div>
        <div class="upload-button">
          <button type="button" class="button-baocun js-open-modal" @click="handleForward">确认提现</button>
        </div>
      </section>
    </div>
  </transition>
</template>

<script>
  import { Header,Cell,Toast,Field } from 'mint-ui';

//  Vue.component(Header.name, Header);
export default {
  components:{
    Header,
    Cell,
  },
  data () {
    return {
      moneyNum:'',
      cardName:'',
      cardNumber:'',
      cardBank:'',
      moneyCount:'',
      bookId:'',
    }
  },

  created(){


    /**获取角色**/

    const myDate = new Date();
//    if(myDate.getDate()!='20' && myDate.getDate()!='21' && myDate.getDate()!='22' && myDate.getDate()!='23' && myDate.getDate()!='24' && myDate.getDate()!='25'){
//      Toast({
//        message: '每月20~25号为提现日哦！',
//        position: 'middle',
//        duration:500
//      });
//
//      setTimeout(()=>{
//        this.$router.push({path:'/data-member-center'})
//    },500)
//    }

    /**获取余额**/
    var params = new URLSearchParams();
    this.$axios({
      method: 'post',
      url:'gp/bu/app!getAccountBooksList.do',
      data:params
    }).then((res)=>{
      console.log(res)
    this.moneyNum=res.data.rows[0].currFund;
    this.bookId=res.data.rows[0].accountBookId;
  })

    this.$axios({
      method: 'post',
      url:'gp/app/userFront!withdrawLast.do',
    }).then((res)=>{
      console.log(res)
      if(res.data.rows[0].cardholder){
        this.cardName=res.data.rows[0].cardholder;
        this.cardNumber=res.data.rows[0].accountCode;
        this.cardBank=res.data.rows[0].accountAddress;
      }
  });
  },
  methods:{
    handleForward(){
//      var reg = /^(\d{16}|\d{19})$/;
      if(this.cardName==''){
        Toast({
          message: '请输入持卡人',
          position: 'middle',
          duration:1000
        });
        return false;
      }
      if(this.cardNumber==''){
        Toast({
          message: '请输入银行卡号',
          position: 'middle',
          duration:1000
        });
        return false;
      }
      if(this.cardBank==''){
        Toast({
          message: '请输入开户银行',
          position: 'middle',
          duration:1000
        });
        return false;
      }
      if(this.moneyCount==0 || this.moneyCount<1){
        Toast({
          message: '提现金额必须大于1',
          position: 'middle',
          duration:1000
        });
        return false;
      }
      if(this.moneyCount>this.moneyNum){
        Toast({
          message: '可提现金额不足',
          position: 'middle',
          duration:1000
        });
        return false;
      }
      const postData={
        accountBookId:this.bookId,
        cardholder:this.cardName,
        accountCode:this.cardNumber,
        accountAddress:this.cardBank,
        amount:this.moneyCount,
      }
      var params = new URLSearchParams();
      params.append('applyData', JSON.stringify(postData));
//      params.append('accountTypeId', '1');
      this.$axios({
        method: 'post',
        url:'gp/app/userFront!withdrawApply.do',
        data:params
      }).then((res)=>{
        console.log(res)
        if(res.data.result==true){
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:1200
          });
        setTimeout(()=>{
          this.$router.push({path:'/store-money'})},1500)
        }else{
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:1200
          });
//          setTimeout(()=>{
//            window.location.reload();
//          },1200)
          return false;
        }
    });
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style>

  .app-bank-information .mint-field .mint-cell-title{
    width: 90px;
  }
  .app-bank-information .app-main {
    padding: 0 0 12px; }
  .app-bank-information .bank-tips {
    background: #fff;
    text-align: center;
    height:44px;
    line-height: 44px;
    margin: 0 0 12px;
    font-size:16px;
    color: #007EE5; }
  .app-bank-information .information-list {
    background: #fff;
    margin: 0 0 13px;
    padding: 0 12px;
    border-radius: 5px; }
  .app-bank-information .information-list .item {
    position: relative;
    overflow: hidden;
    height:52px;
    margin: 0;
    padding-right:28px;
    line-height:52px;
    border-bottom: 1px solid #eee; }
  .app-bank-information .information-list .item:last-child {
    border-bottom: none; }
  .app-bank-information .information-list .item-title {
    font-size:16px;
    color: #333;
    float: left;
    width: 28%; }
  .app-bank-information .information-list .item-title-special {
    letter-spacing:8px; }
  .app-bank-information .information-list .item-input {
    width: 72%;
    float: left;
    color: #999;
    font-size:16px;
    height:52px;
    line-height:52px;
    border: none;
    outline: none; }
  .app-bank-information .information-list .item-input::-webkit-input-placeholder {
    color: #999; }
  .app-bank-information .money-content {
    background: #fff;
    padding: 0 12px;
    margin: 0 0 17px; }
  .app-bank-information .money-content .item-input {
    display: block;
    width: 100%;
    color: #999;
    font-size:16px;
    height:52px;
    line-height:52px;
    border: none;
    outline: none; }
  .app-bank-information .money-content .item-input::-webkit-input-placeholder {
    color: #999; }
  .app-bank-information .money-content .money-input {
    position: relative;
    border-bottom: 1px solid #eee;
    padding-right:140px;
    line-height:52px; }
  .app-bank-information .money-content .money-tips {
    position: absolute;
    top: 0;
    right: 0;
    font-size:14px;
    color: #333333; }
  .app-bank-information .money-content .money-num {
    color: #ef3b3c;
    font-size: 18px;
    margin:0 3px;
  }
  .app-bank-information .money-content .action-tips {
    height:44px;
    line-height:44px;
    font-size:12px;
    color: #333; }
  .app-bank-information .money-content .action-tips .text-danger {
    color: #007EE5; }
  .app-bank-information .upload-button {
    padding: 0 12px }
  .app-bank-information .button-baocun {
    background: #007EE5;
    display: block;
    width: 100%;
    padding:11px 0;
    text-align: center;
    border-radius: 42px;
    font-size:16px;
    color: #fff;
    border: none;
    outline: none; }
  .app-bank-information .button-baocun.button-disabled {
    background: #999; }
</style>
